var React = require('react');


var Header = require('../widget/Header');
var Footer = require('../widget/Footer');
var ajax = require('../tools/ajax');
var OrderNum = require('../components/OrderNum');
var Icon = require('../components/Icon');

module.exports = React.createClass({
    getInitialState: function () {
        return {
            theme:"Default",
            userId:localStorage.getItem("userId"),
            commentInfo:"",//评论信息
            account:"",//账户
            username:"",//用户名
            userInfo:""//用户信息
        }
    },

    componentDidMount: function () {
        this.getUserInfoByUid();
        this.getCommentById();
        window.goBack =this.goBack;
        this.getCartlistByid();
    },
    //安卓返回键功能
    goBack:function(){
        location.href = "#";
    },

    action(e){
        var userId = localStorage.getItem("userId");
        if(userId){
            var action = e.currentTarget.getAttribute("action");
            if(action == "#addressInfo"){
                localStorage.setItem("orderFlag",0);
            }
            location.href = action;
        }else{
            location.href = "#login";
        }
    },
    //登录状态
    loginState:function(){
        if(this.state.account){
            location.href = "#userinfo";
        }else{
            location.href = "#login";
        }
    },
    //获取用户信息
    getUserInfoByUid(){
        var p = this;
        var userId = this.state.userId;
        if(userId) {
            ajax("POST", "getUserInfoByUid", {userId: userId}, function (dt) {
                if (dt && dt.success) {
                    var objs = dt.data[0];
                    var UserInfo = JSON.stringify(objs);
                    localStorage.setItem("UserInfo",UserInfo);
                    p.setState({
                        userInfo:objs,
                        account: objs.account,
                        username: objs.username
                    })
                }
            })
        };
    },
    //获取评论
    getCommentById(){
        var p = this;
        var user_id = this.state.userId;
        if(user_id) {
            ajax("POST", "getCommentById", {
                user_id: user_id
            }, function (dt) {
                if (dt && dt.success) {
                    var objs = dt.data;
                    var commentInfo = [];
                    for(var i = 0;i<objs.length;i++){
                        commentInfo.push(objs[i]);
                    }
                    p.setState({
                        commentInfo: commentInfo
                    })
                }
            })
        }
    },
    //删除评论
    deleteCommentById(e){
        var p = this;
        var Id = e.currentTarget.getAttribute("data");
        if(Id) {
            ajax("POST", "deleteCommentById", {
                Id: Id
            }, function (dt) {
                console.log(dt);
            })
        }
        this.getCommentById();
    },
    /**获取购物车列表信息 */
    getCartlistByid:function(){
        var p = this;
        var userId = localStorage.getItem('userId');
        ajax("POST","getCartlistByid",{user_id:userId},function(dt){
            if(dt && dt.success){
                var objs = dt.data;
                localStorage.setItem("cartNum",objs.length);
            }
        });
    },

    render: function () {
        var p=this;
        var conmmentInfo = this.state.commentInfo;
        var userInfo = p.state.userInfo;
        if(conmmentInfo) {
            var commentList = conmmentInfo.map(function (obj) {
                var imgSrc = JSON.parse(obj.photo);
                return (
                    <div key={obj.Id} className="evaluateMain">
                        <img src={imgSrc[0]}/>
                        <div className="content">
                            <p>{obj.content}</p>
                        </div>
                        <ul className="function">
                            <li><Icon icon="#icon-dianzan"/><label>{obj.zan_number}</label></li>
                            <li><Icon icon="#icon-groupcopy5"/><label>{obj.comment_number}</label></li>
                            <li><Icon icon="#icon-fenxiang"/><label>{obj.share_number}</label></li>
                            <li onClick={p.deleteCommentById} data={obj.Id} ><Icon icon="#icon-shanchu1"/></li>
                        </ul>
                    </div>
                )
            });
        }
        return (
            <div className="main"  id="main">
                <div className="user_info" onClick={p.loginState}>
                    <img className="user_img" src={userInfo.photo?userInfo.photo:"http://115.29.198.39:8080/upload/app/857749830834048835.png"} />
                    <div className='user_name'>
                        {userInfo.account ? (userInfo.nickname?userInfo.nickname:userInfo.account): "点击登录"}
                    </div>
                </div>
                <div className="content-box">
                    <ul className="collection-tips">
                        <li className="item-text" onClick={this.action} action="#myorders">
                            <div className="item-icon">
                                <Icon icon="#icon-wodedingdan_fuzhi" style={{fontSize:"1.1rem"}}/>
                            </div>
                            <div className="item-main" >
                                <p className="item-title">我的订单</p>
                            </div>
                        </li>
                        <li className="item-text" onClick={this.action} action="#addressInfo">
                            <div className="item-icon">
                                <Icon icon="#icon-shouhuodizhi" style={{fontSize:"1.1rem"}}/>
                            </div>
                            <div className="item-main">
                                <p className="item-title">收货地址</p>
                            </div>
                        </li>
                        <li className="item-text" onClick={this.action} action="#about">
                            <div className="item-icon">
                                <Icon icon="#icon-guanyuwomen" style={{fontSize:"1.1rem"}}/>
                            </div>
                            <div className="item-main">
                                <p className="item-title">关于我们</p>
                            </div>
                        </li>
                        <li className="item-text" onClick={this.action} action="#customerService">
                            <div className="item-icon">
                                <Icon icon="#icon-lianxikefu" style={{fontSize:"1.1rem"}}/>
                            </div>
                            <div className="item-main" >
                                <p className="item-title">联系客服</p>
                            </div>
                        </li>
                        <li className="item-text">
                            <div className="item-icon">
                                <Icon icon="#icon-yijianfankui" style={{fontSize:"1.1rem"}}/>
                            </div>
                            <div className="item-main">
                                <p className="item-title">意见反馈</p>
                            </div>
                        </li>
                    </ul>
                </div>
                <hr className="orderHr" />
                <div className="evaluateHead">
                    发布评论
                    <Icon icon="#icon-tianjia1" className="" click={this.action} action="#evaluate" style={{display: this.state.commentInfo == ""  ? "block" : "none" }} />
                </div>
                <div className="releaseEvaluate">
                    <div className="evaluateMainFirst" style={{display: this.state.commentInfo == "" ? "block" : "none"}} >
                        <div className="Initialization">
                            <p>发布评论的人是最美的天使</p>
                            <p className="first" onClick={this.action} action="#evaluate">开始创建第一条评价</p>
                        </div>
                    </div>
                    <div className="evaluateWrap"  style={{display: this.state.commentInfo =="" ? "none" : "block"}}>
                        {commentList}
                    </div>
                </div>
                <Footer witchSelected="wode"></Footer>
            </div>
        )
    }
});
